As respostas a esta pergunta são um esforço da comunidade. Edite as respostas existentes para melhorar esta postagem. Atualmente não está aceitando novas respostas ou interações. Como posso redirecionar o usuário de uma página para outra usando jQuery ou JavaScript puro?
2020-12-07 22:01:35
1
2
Próximo
Não se redireciona simplesmente usando jQuery
jQuery não é necessário e window.location.replace (...) irá simular melhor um redirecionamento HTTP.
window.location.replace (...) é melhor do que usar window.location.href, porque replace () não mantém a página de origem no histórico da sessão, o que significa que o usuário não ficará preso em um fundo sem fim botão fiasco.
Se você quiser simular alguém clicando em um link, use
location.href
Se você quiser simular um redirecionamento HTTP, use location.replace
Por exemplo:
// comportamento semelhante a um redirecionamento HTTP
window.location.replace ("http://stackoverflow.com");
// comportamento semelhante ao clicar em um link
window.location.href = "http://stackoverflow.com";
|
AVISO: Esta resposta foi fornecida apenas como uma solução possível; obviamente não é a melhor solução, pois requer jQuery. Em vez disso, prefira a solução JavaScript pura.
$ (localização) .attr ('href', 'http://stackoverflow.com')
|
Maneira "vanilla" padrão do JavaScript de redirecionar uma página
window.location.href = 'newPage.html';
Ou mais simplesmente: (já que a janela é global)
location.href = 'newPage.html';
Se você está aqui porque está perdendo HTTP_REFERER ao redirecionar, continue lendo:
(Caso contrário, ignore esta última parte)
A seção a seguir é para aqueles que usam HTTP_REFERER como uma das muitas medidas de segurança (embora não seja uma grande medida de proteção). Se você estiver usando o Internet Explorer 8 ou inferior, essas variáveis serão perdidas ao usar qualquer forma de redirecionamento de página JavaScript (location.href, etc.).
Abaixo vamos implementar uma alternativa para IE8 e inferior para não perdermos HTTP_REFERER. Caso contrário, quase sempre você pode simplesmente usar window.location.href.
Testar em HTTP_REFERER (colagem de URL, sessão, etc.) pode ajudar a saber se uma solicitação é legítima.
(Observação: também há maneiras de contornar / falsificar esses referenciadores, conforme observado pelo link do droop nos comentários)
Solução simples de teste em vários navegadores (fallback para window.location.href para Internet Explorer 9+ e todos os outros navegadores)
Uso: redirect ('anotherpage.aspx');
function redirect (url) {
var ua = navigator.userAgent.toLowerCase (),
isIE = ua.indexOf ('msie')! == -1,
versão = parseInt (ua.substr (4, 2), 10);
// Internet Explorer 8 e inferior
if (isIE && version <9) {
var link = document.createElement ('a');
link.href = url;
document.body.appendChild (link);
link.click ();
}
// Todos os outros navegadores podem usar o window.location.href padrão (eles não perdem HTTP_REFERER como o Internet Explorer 8 e inferior)
outro {
window.location.href = url;
}
}
|
Existem muitas maneiras de fazer isso.
// window.location
window.location.replace ('http://www.example.com')
window.location.assign ('http://www.example.com')
window.location.href = 'http://www.example.com'
document.location.href = '/ caminho'
// window.history
window.history.back ()
window.history.go (-1)
// window.navigate; SOMENTE para versões antigas do Internet Explorer
window.navigate ('top.jsp')
// Provavelmente não bueno
self.location = 'http://www.example.com';
top.location = 'http://www.example.com';
// jQuery
$ (localização) .attr ('href', 'http: //www.example.com')
$ (janela) .attr ('local', 'http: //www.example.com')
$ (localização) .prop ('href', 'http://www.example.com')
|
Isso funciona para todos os navegadores:
window.location.href = 'your_url';
|
Ajudaria se você fosse um pouco mais descritivo no que está tentando fazer. Se você estiver tentando gerar dados paginados, há algumas opções de como fazer isso. Você pode gerar links separados para cada página que deseja acessar diretamente.
1
2
3
...
Observe que a página atual no exemplo é tratada de forma diferente no código e com CSS.
Se você deseja que os dados paginados sejam alterados por meio de AJAX, é aí que entra o jQuery. O que você faria é adicionar um manipulador de cliques a cada uma das marcas âncora correspondentes a uma página diferente. Este manipulador de cliques invocará algum código jQuery que vai e busca a próxima página via AJAX e atualiza a tabela com os novos dados. O exemplo a seguir pressupõe que você tenha um serviço da web que retorna os novos dados da página.
$ (document) .ready (function () {
$ ('a.pager-link'). click (function () {
var page = $ (this) .attr ('href'). split (/ \? /) [1];
$ .ajax ({
tipo: 'POST',
url: '/ path-to-service',
dados: página,
sucesso: função (conteúdo) {
$ ('# minhaTabela'). html (conteúdo); // substituir
}
});
retorna falso; // para parar o link
});
});
|
Eu também acho que location.replace (URL) é a melhor maneira, mas se você quiser notificar os mecanismos de pesquisa sobre o seu redirecionamento (eles não analisam o código JavaScript para ver o redirecionamento), você deve adicionar o meta rel = "canonical" tag para o seu site.
Adicionar uma seção noscript com uma meta tag de atualização HTML também é uma boa solução. Eu sugiro que você use esta ferramenta de redirecionamento de JavaScript paracriar redirecionamentos. Ele também tem suporte para Internet Explorer para passar o referenciador HTTP.
O código de amostra sem demora tem a seguinte aparência:
|
Mas se alguém quiser redirecionar de volta para a página inicial, ele pode usar o seguinte trecho.
window.location = window.location.host
Seria útil se você tivesse três ambientes diferentes, como desenvolvimento, teste e produção.
Você pode explorar esta janela ou objeto window.location apenas colocando essas palavras no Console do Chrome ou no Console do Firebug.
|
JavaScript fornece muitos métodos para recuperar e alterar o URL atual que é exibido na barra de endereços do navegador. Todos esses métodos usam o objeto Location, que é uma propriedade do objeto Window. Você pode criar um novo objeto Location que tenha o URL atual da seguinte maneira.
var currentLocation = window.location;
Estrutura Básica de um URL
//:/
Protocolo - especifica o nome do protocolo a ser usado para acessar o recurso na Internet. (HTTP (sem SSL) ou HTTPS (com SSL))
hostname - o nome do host especifica o host que possui o recurso. Por exemplo, www.stackoverflow.com. Um servidor fornece serviços usando o nome do host.
porta - Um número de porta usado para reconhecer um processo específico para o qual uma Internet ou outra mensagem de rede deve ser encaminhada quando chega a um servidor.
nome do caminho - o caminho fornece informações sobre o recurso específico dentro do host que o cliente Web deseja acessar. Por exemplo, stackoverflow.com/index.html.
query - uma string de consulta segue o componente do caminho e fornece uma string de informações que o recurso pode utilizar para alguma finalidade (por exemplo, como parâmetros para uma pesquisa ou como dados a serem processados).
hash - a parte âncora de um URL, inclui o sinal de hash (#).
Com essas propriedades do objeto Location, você pode acessar todos esses componentes de URL
hash - define ou retorna a parte âncora de um URL.
host -Sets
ou retorna o nome do host e a porta de um URL.
hostname -Sets ou
retorna o nome do host de um URL.
href - define ou retorna todo o
URL.
pathname - define ou retorna o nome do caminho de um URL.
porta -Define ou retorna o número da porta que o servidor usa para um URL.
protocolo - define ou retorna o protocolo de um URL.
search -Sets
ou retorna a parte da consulta de um URL
Agora, se você quiser mudar uma página ou redirecionar o usuário para outra página vocêpoderáusar a propriedade href do objeto Location como este
Você pode usar a propriedade href do objeto Location.
window.location.href = "http://www.stackoverflow.com";
Objeto de localização também tem esses três métodos
assign () - Carrega um novo documento.
reload () - recarrega o documento atual.
substituir () - Substitui o documento atual por um novo
Você pode usar os métodos assign () e replace também para redirecionar para outras páginas como essas
location.assign ("http://www.stackoverflow.com");
location.replace ("http://www.stackoverflow.com");
Como assign () e replace () diferem - A diferença entre o método replace () e o método assign () (), é que replace () remove a URL do documento atual do histórico do documento, significa que não é possível usar o botão "voltar" para navegar de volta ao documento original. Portanto, use o método assign () se quiser carregar um novo documento e dar a opção de navegar de volta ao documento original.
Você pode alterar a propriedade href do objeto de localização usando jQuery também como este
$ (localização) .attr ('href', url);
E, portanto, você pode redirecionar o usuário para algum outro url.
|
Basicamente jQuery é apenas um framework JavaScript e para fazer algumas coisas como redirecionamento, neste caso, você pode apenas usar JavaScript puro, então, nesse caso, você tem 3 opções usando vanillaJavaScript:
1) Usando a substituição de local, irá substituir o histórico atual da página, significa que não é possível usar o botão Voltar para voltar à página original.
window.location.replace ("http://stackoverflow.com");
2) Usando a atribuição de local, isso manterá o histórico para você e usando o botão Voltar, você pode voltar à página original:
window.location.assign ("http://stackoverflow.com");
3) Eu recomendo usar uma das formas anteriores, mas esta poderia ser a terceira opção usando JavaScript puro:
window.location.href = "http://stackoverflow.com";
Você também pode escrever uma função em jQuery para manipulá-la, mas não é recomendado, pois é apenas uma função JavaScript pura de uma linha. Você também pode usar todas as funções acima sem janela se já estiver no escopo da janela, por exemplo window.location.replace ("http://stackoverflow.com"); pode ser location.replace ("http://stackoverflow.com");
Também mostro todos na imagem abaixo:
|
Deve ser capaz de definir usando window.location.
Exemplo:
window.location = "https://stackoverflow.com/";
Aqui está uma postagem anterior sobre o assunto: Como faço para redirecionar para outra página da web?
|
Antes de começar, jQuery é uma biblioteca JavaScript usada para manipulação de DOM. Portanto, você não deve usar jQuery para um redirecionamento de página.
Uma citação de Jquery.com:
Embora o jQuery possa ser executado sem grandes problemas em versões mais antigas do navegador,
não testamos ativamente o jQuery neles e geralmente não corrigimos bugs
que podem aparecer neles.
Foi encontrado aqui:
https://jquery.com/browser-support/
Portanto, jQuery não é uma solução definitiva para compatibilidade com versões anteriores.
A solução a seguir usando JavaScript bruto funciona em todos os navegadores e tem sido padrão por um longo tempo, então você não precisa de nenhuma biblioteca para suporte cruzado de navegadores.
Esta página será redirecionada para o Google após 3.000 milissegundos
exemplo
Você será redirecionado para o Google em breve.
As diferentes opções são as seguintes:
window.location.href = "url"; // Simula a navegação normal para uma nova página
window.location.replace ("url"); // Remove o URL atual do histórico e o substitui por um novo URL
window.location.assign ("url"); // Adiciona um novo URL à pilha de histórico e redireciona para o novo URL
window.history.back (); // Simula um clique no botão Voltar
window.history.go (-1); // Simula um clique no botão Voltar
window.history.back (-1); // Simula um clique no botão Voltar
window.navigate ("page.html"); // Igual a window.location = "url"
Ao usar substituir, o botão Voltar não vai voltar para a página de redirecionamento, como se ela nunca tivesse estado no histórico. Se você quiser que o usuário volte para a página de redirecionamento, use window.location.href ou window.location.assign. Se você usar uma opção que permite ao usuário voltar para a página de redirecionamento, lembre-se de que, ao entrar na página de redirecionamento, ela o redirecionará de volta. Portanto, leve isso em consideração ao escolher uma opção para o seu redirecionamento. Sob condições em que a página está redirecionando apenas quando uma ação é realizada pelo usuário, então, ter a página no histórico do botão Voltar estará bem. Mas se a página redirecionar automaticamente, você deve usar substituir para que o usuário possa usar o botão Voltar sem ser forçado a voltar para a página que o redirecionamento envia.
Você também pode usar metadados para executar um redirecionamento de página conforme a seguir.
META Refresh
Localização META
Hijacking BASE
Vá embora
Vá embora
Se você combinar os exemplos de duas páginas, você terá um ciclo infantil de redirecionamento queirá garantir que o seu usuário nunca mais queira usar o seu site.
|
var url = 'asdf.html';
window.location.href = url;
|
Você pode fazer isso sem jQuery como:
window.location = "http://yourdomain.com";
E se você quiser apenas jQuery, você pode fazer assim:
$ jq (janela) .attr ("local", "http://yourdomain.com");
|
Isso funciona com jQuery:
$ (janela) .attr ("local", "http://google.fr");
|
# Redirecionamento de página HTML usando método jQuery / JavaScript
Experimente este código de exemplo:
function YourJavaScriptFunction ()
{
var i = $ ('# login'). val ();
if (i == 'login')
window.location = "Login.php";
outro
window.location = "Logout.php";
}
Se você deseja fornecer um URL completo como window.location = "www.google.co.in" ;.
|
Pergunta original: "Como redirecionar usando jQuery?", Portanto, a resposta implementa jQuery >> Caso de uso complementar.
Para redirecionar apenas para uma página com JavaScript:
window.location.href = "/ contato /";
Ou se você precisar de um atraso:
setTimeout (function () {
window.location.href = "/ contato /";
}, 2000); // Tempo em milissegundos
jQuery permite selecionar elementos de uma página da web com facilidade. Você pode encontrar o que quiser em uma página e usar o jQuery para adicionar efeitos especiais, reagir às ações do usuário ou mostrar e ocultar conteúdo dentro ou fora do elemento selecionado. Todas essas tarefas começam sabendo como selecionar um elemento ou evento.
$ ('a, img'). on ('clicar', função (e) {
e.preventDefault ();
$ (este) .animado ({
opacity: 0 // Coloque alguma animação CSS aqui
}, 500);
setTimeout (function () {
// OK, equipe jQuery concluída, vamos redirecionar
window.location.href = "/ contato /";
}, 500);
});
Imagine que alguém escreveu um script / plugin com 10.000 linhas de código. Com jQuery você pode se conectar a este código com apenas uma linha ou duas.
|
Você precisa colocar esta linha em seu código:
$ (localização) .attr ("href", "http://stackoverflow.com");
Se você não tem jQuery, vá com JavaScript:
window.location.replace ("http://stackoverflow.com");
window.location.href ("http://stackoverflow.com");
|
Então, a questão é como fazer uma página de redirecionamento, e não como redirecionar para um site?
Você só precisa usar JavaScript para isso. Aqui está um pequeno código que criará uma página de redirecionamento dinâmico.
Então, digamos que você acabou de colocar este snippet em um arquivo redirect / index.html em seu site, você pode usá-lo como tal.
http://www.mywebsite.com/redirect?url=http://stackoverflow.com
E se você acessar esse link, ele o redirecionará automaticamente para stackoverflow.com.
Link para documentação
E é assim que você faz uma página de redirecionamento simples com JavaScript
Editar:
Há também uma coisa a ser observada. Eu adicionei window.location.replace no meu código porque acho que é adequado para uma página de redirecionamento, mas, você deve saber que ao usar window.location.replace e for redirecionado, quando você pressiona o botão Voltar em seu navegador voltou para a página de redirecionamento, e ele irá voltar para a página anterior, dê uma olhada nesta pequena demonstração.
Exemplo:
O processo: store home => redirect page to google => google
Quando estiver no google: google => botão voltar no navegador => página inicial da loja
Portanto, se isso atende às suas necessidades, então tudo deve estar bem. Se você deseja incluir a página de redirecionamento no histórico do navegador, substitua esta
if (url) window.location.replace (url);
com
if (url) window.location.href = url;
|
Em sua função de clique, basta adicionar:
window.location.href = "O URL para onde você deseja redirecionar";
$ ('# id'). click (function () {
window.location.href = "http://www.google.com";
});
|
Experimente isto:
location.assign ("http://www.google.com");
Fragmento de código de exemplo.
|
jQuery não é necessário. Você consegue fazer isso:
window.open ("URL", "_ self", "", "")
É muito fácil!
A melhor maneira de iniciar uma solicitação HTTP é com document.loacation.href.replace ('URL').
|
Primeiro escreva corretamente. Você deseja navegar dentro de um aplicativo para outro link de seu aplicativo para outro link. Aqui está o código:
window.location.href = "http://www.google.com";
E se você quiser navegar nas páginas do seu aplicativo, também tenho o código, se quiser.
|
Você pode redirecionar em jQuery assim:
$ (localização) .attr ('href', 'http://yourPage.com/');
|
Usando JavaScript:
Método 1:
window.location.href = "http://google.com";
Método 2:
window.location.replace ("http://google.com");
Usando jQuery:
Método 1: $ (localização)
$ (localização) .attr ('href', 'http://google.com');
Método 2: Função Reutilizável
jQuery.fn.redirectTo = function (url) {
window.location.href = url;
}
jQuery (janela) .redirectTo ("http://google.com");
|
Em JavaScript e jQuery, podemos usar o seguinte código para redirecionar uma página para outra página:
window.location.href = "http://google.com";
window.location.replace ("page1.html");
|
ECMAScript 6 + jQuery, 85 bytes
$ ({jQueryCode: (url) => location.replace (url)}). attr ("jQueryCode") ("http://example.com")
Por favor não matemim, isso é uma piada. É uma piada. Isso é uma piada.
Isso "deu uma resposta à questão", no sentido de que pedia uma solução "usando jQuery" que, neste caso, implica forçá-lo de alguma forma na equação.
Ferrybig aparentemente precisa que a piada seja explicada (ainda está brincando, tenho certeza de que há opções limitadas no formulário de avaliação), então, sem mais delongas:
Outras respostas são usar attr () do jQuery nos objetos de localização ou janela desnecessariamente.
Essa resposta também abusa dela, mas de uma forma mais ridícula. Em vez de usá-lo para definir o local, ele usa attr () para recuperar uma função que define o local.
A função é chamada de jQueryCode, embora não haja nada de jQuery sobre ela, e chamar uma função somethingCode é simplesmente horrível, especialmente quando o something nem é uma linguagem.
Os "85 bytes" são uma referência ao Code Golf. Obviamente, o golfe não é algo que você deva fazer fora do código de golfe e, além disso, esta resposta claramente não é golfe de verdade.
Basicamente, encolhe-se.
|
Javascript:
window.location.href = 'www.your_url.com';
window.top.location.href = 'www.your_url.com';
window.location.replace ('www.your_url.com');
Jquery:
var url = 'www.seu_url.com';
$ (localização) .attr ('href', url);
$ (local) .prop ('href', url); // em vez de local você pode usar janela
|
Aqui está um redirecionamento de atraso de tempo. Você pode definir o tempo de atraso para o que quiser:
Título do seu documento
Você será redirecionado em 8 segundos!
|
Existem três maneiras principais de fazer isso,
window.location.href = 'blaah.com';
window.location.assign ('blaah.com');
e...
window.location.replace ('blaah.com');
O último é melhor, para um redirecionamento tradicional, porque não salvará a página que você acessou antes de ser redirecionado em seu histórico de pesquisa. No entanto, se você deseja apenas abrir uma guia com JavaScript, pode usar qualquer uma das opções acima.1
EDIT: O prefixo da janela é opcional.
|
1
2
Próximo
Não é a resposta que você está procurando? Navegue por outras questões com a tag javascript jquery redirect ou faça sua própria pergunta.